<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <!-- 
        类选择器：
            第一步：先给盒子起一个class名字   这个名字叫类名
            第二步：通过.className 选中一个或多个盒子

        伪类：
            所谓的伪类，就是不存在这个一个类。  
            伪类有很多，我们先学习一个，叫 hover
            伪类使用时，不是通过.，是通过：       :hvoer     hover这个类并不存在
            hover表示你去摸这个盒子的状态  你摸的时候就是hover
     -->
     <style>
         .box{ color: red; }
         div:hover{
             color: yellow;
         }
         a{
            color: black;
            text-decoration: none;
         }
         a:hover{
            color: blue;
            text-decoration: underline;
         }
     </style>
</head>
<body>
    <div class="box">我是一个孤独的div</div>

    <a href="#">百度一下，你就知道</a>
</body>
</html>